<template>
  <div>
    <scroller 
      ref="my_scroller" 
      :on-refresh="refresh" 
      :on-infinite="infinite" 
      style="margin-top:50px">
      <ul class="mui-table-view">
        <li 
          v-for="(item, index) in finfoList" 
          :key="index" 
          class="mui-table-view-cell mui-media"
          @click="goinfodetail(item)">
          <img 
            :src="item.img" 
            class="mui-media-object mui-pull-left">
          <div class="mui-media-body">
            <p class="zxtitle fs16 colr"> {{ item.title }}</p>
            <p class="zxcontent colb">{{ item.desc }}</p>
            <p>{{ item.addtime }}</p>
          </div>
        </li>
      </ul>
    </scroller>
  </div>
</template>

<script>
export default {
  layout: 'default2',
  data() {
    return {
      page: 1,
      pageSize: '10',
      ts: this.newStore(),
      finfoList: []
    }
  },
  created() {
    this.getinfoList()
  },
  methods: {
    refresh(done) {
      this.page = 1
      this.getinfoList(done)
      setTimeout(() => {
        this.$refs.my_scroller.finishPullToRefresh()
      }, 200)
    },
    infinite(done) {
      setTimeout(() => {
        this.page += 1
        this.getinfoList(done)
      }, 500)
    },
    getinfoList(fn) {
      const req = {
        token: localStorage.getItem('token'),
        page: this.page + '',
        pageSize: this.pageSize
      }
      this.spost(this.ts, '/Newindex/noticeList', req).then(ts => {
        if (ts.d.data.length < 1) {
          fn(true)
          return
        } else if (fn) {
          fn()
        }
        if (this.page == 1) {
          this.finfoList = ts.d.data
        } else {
          this.finfoListt = this.finfoList.concat(ts.d.data)
        }
      })
    },
    goinfodetail(item) {
      console.log(item)

      this.$router.push({
        name: 'finformdetail',
        query: {
          from: '通知',
          word: '通知详情',
          id: item.noticeid,
          token: localStorage.getItem('token')
        }
      })
    }
  }
}
</script>

<style>
.zxtitle {
  padding-bottom: 5px;
}
.zxcontent {
  line-height: 20px;
  min-height: 64px;
  max-height: 60px;
  overflow: hidden;
}
</style>
